<template>
  <div>
    <div class="bucket">名称:{{ car.name }} 编号:{{ car.carNumber }}</div>
    <div class="dumpVideo-button" @click="jump">如果无法正常展示页面,点击跳转并在高级中点击信任后返回</div>
    <iframe :src=linkUrl frameborder="0" :style="{ 'height': '85vh', 'width': '100%', 'margin-left': '10px' }"></iframe>
  </div>
</template>

<script>
import { getVideoUrl } from "@/api/system/area";
import { getCar } from "@/api/system/car";
export default {
  name: "dumpVideo",
  data() {
    return {
      linkUrl: '',
      car: {},
    };
  },
  created() {
    this.getList()
  },
  methods: {
    getList() {
      this.loading = true;
      const query = this.$route.query;
      getCar(query.id).then(response => {
        if (response.code === 200) {
          this.car = response.data;
          getVideoUrl({ carNumber: this.car.carNumber }).then(response => {
            this.linkUrl = response.data;
            this.loading = false;
          }
          );
        }
      });
    },
    jump() {
      window.open(this.linkUrl, '_blank');
    }
  }
};
</script>
<style lang="scss" scoped>
.bucket{
  text-align: center;
  margin: 5px 0;
}
.dumpVideo-button {
  font-size: 14px;
  margin: 10px;
  color: #1890ff;
  cursor: pointer;
}
</style>
